<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1309180_m0vigzfu7y.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <title>搜索结果</title>
    <link rel="stylesheet" href="css/search.css">
</head>
<body>
<!-- 导航栏 -->
<nav>
    <ul>
        <li>  
            <a href="dashboard.html">  <i class="fas fa-home"></i> 返回</a>  
        </li>   
        <!-- <li><div class="text-container">  
            <div class="big-text">HuiKing-Movie</div>  
             <div class="small-text">斯是陋室，惟吾德馨</div></div> 
        </li> -->
        <li class="search-bar">
            <input type="text" id="searchInput" placeholder="搜索...">
            <button onclick="search()" ><i class="iconfont iconchazhao"></i></button>
        </li>
        <li><a href="https://www.taobao.com" target="_blank">编者推荐</a></li>
        <li><a href="https://yiyan.baidu.com/" target="_blank">AI导航</a></li>
        <li><a href="javascript:goToMyPage()">我的</a></li>
    </ul>
</nav>

    <div class="movies-container">
        <div class="movie-header">  
            <h1>搜索结果</h1>  
        </div>
        <hr> 
        <div id="searchResultsSection"></div>  
    </div>

    <script>
        function goToMyPage() {
            const identity = localStorage.getItem('identity');
            if (identity === '0') {
                window.location.href = 'user_dashboard.html';
            } else if (identity === '1') {
                window.location.href = 'superadmin_dashboard.html';
            } else if (identity === '2') {
                window.location.href = 'admin_dashboard.html';
            }
        }
        window.onload = function() {
            const searchResults = JSON.parse(localStorage.getItem('searchResults')) || [];
            const searchResultsSection = document.getElementById('searchResultsSection');
            const token = localStorage.getItem('access_token');
            const userId = localStorage.getItem('user_id');

            if (searchResults.length === 0) {
                searchResultsSection.innerHTML = '<p>暂无搜索结果</p>';
            } else {
                searchResults.forEach(movie => {
                    const movieDiv = document.createElement('div');
                    movieDiv.className = 'box';
                    movieDiv.innerHTML = `
                    <div class = "result-container">
                        <div class="image-container">
                            <img src="images/background.jpg" alt="Your Image">
                        </div>
                        <a href="movie.html?film_id=${movie.film_id}" onclick="saveFilmId(${movie.film_id})"><img src="${movie.www_http}" alt="${movie.film_name}"></a>
                        <div class = "details">
                        <h4><a href="movie.html?film_id=${movie.film_id}" onclick="saveFilmId(${movie.film_id})">${movie.film_name}</a></h4>
                        <a href="https://www.bilibili.com/" target="_blank" class="play-btn"> <i class="fas fa-play-circle"></i>立即播放</a>  
                        </div>
                    </div>
                    `;
                    searchResultsSection.appendChild(movieDiv);
                });
            }
        }

        function saveFilmId(filmId) {
            localStorage.setItem('selectedFilmId', filmId);
        }
        function search() {
            const searchInput = document.getElementById('searchInput').value;
            const userId = localStorage.getItem('user_id') || 'guest';
            const token = localStorage.getItem('access_token');

            if (searchInput.trim() === '') {
                alert('请输入搜索内容');
                return;
            }

            const requestData = {
                user_id: parseInt(userId),
                search: searchInput
            };

            fetch('http://192.168.78.248:5000/search', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': `Bearer ${token}`
                },
                body: JSON.stringify(requestData)
            })
            .then(response => response.json())
            .then(data => {
                if (data.status === 'successfully') {
                    localStorage.setItem('searchResults', JSON.stringify(data.film));
                    window.location.href = 'search.html';
                } else {
                    alert('暂无搜索结果');
                }
            })
            .catch(error => {
                console.error('Error:', error);
            });
        }
    </script>
</body>
</html>
